<!--用户管理 -->
<template>
  <div class="each-model">
    <div class="page-nav">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/' }"><i class="el-icon-home" style="margin-right: 6px;"></i>代理商管理</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="page-content">
      <div class="page-content-box">
        <div class="page-content-header">
          <div class="model-title">
            <span>代理商管理</span>
            <div class="add-new-btn">
              <el-button v-show="buttonPermission['agent_manage-agent_2']" @click="addCustom" style="margin-top: 4px;" size="small" type="primary" icon="plus">添加代理商</el-button>
            </div>
          </div>
        </div>
        <div class="page-content-main">
          <div class="model-content">
            <el-row :gutter="15">
              <el-col :span="4"><div class="grid-content">
                <el-input placeholder="请输入关键字"></el-input>
              </div></el-col>
              <el-col :span="3"><div class="grid-content">
                <el-button style="width: 100%;">搜索</el-button>
              </div></el-col>
            </el-row>
            <el-table
                    :data="tableData"
                    border
                    style="width: 100%;margin-top: 15px;">
              <el-table-column
                      prop="createDate"
                      label="创建时间">
              </el-table-column>
              <el-table-column
                      prop="name"
                      label="代理商">
              </el-table-column>
              <el-table-column
                      prop="address"
                      label="地址">
              </el-table-column>
              <el-table-column
                      prop="contactName"
                      label="联系人">
              </el-table-column>
              <el-table-column
                      prop="contactPhone"
                      label="联系人电话">
              </el-table-column>
              <el-table-column
                      prop="status"
                      label="状态">
                <template scope="scope">
                  <span v-if="scope.row.status == 0">正常</span>
                  <span v-if="scope.row.status == 1">删除</span>
                </template>
              </el-table-column>

              <el-table-column
                      fixed="right"
                      label="操作"
                      width="140">
                <template scope="scope">
                  <el-button type="text" size="small" @click="customerInfoDetails(scope.row.id)">详情</el-button>
                  <el-button v-show="buttonPermission['agent_manage-agent_3']" @click="editOrg(scope.row.id)" type="text" size="small">编辑</el-button>
                  <!--<el-button type="text" size="small">禁用</el-button>-->
                  <el-button v-show="buttonPermission['agent_manage-agent_4']" type="text" size="small" @click="deleteOrg(scope.row.id)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
            <paging v-bind:pagingInfo="pagingInfo" v-on:gotoPage="gotoPage"></paging>
          </div>
        </div>

      </div>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">

  import Paging from '../common/Paging.vue'

  export default {
    name: 'agencyManage',
    data : function(){
      return {
        /*表格*/
        tableData: [],
        page:1,
        pagingInfo:{
          totalPage:1,
          page:1,
          perPage:10,
          total:0
        }
      }
    },
    mounted:function(){
      this.getAgencyList();
    },
    computed: {
        buttonPermission:function(){
            return this.$store.state.permissionStore.buttonPermissions;
        }
    },
    methods: {
      deleteOrg: function (customerInfoId) {
          var that=this;
          this.$confirm("你确定删除吗?","危险操作", {
            type: 'warning'
          }).then(function() {
            var delForm={
              id:customerInfoId,
              status:1
            };
            that.$rsClient.put("/customerInfo/" + customerInfoId,delForm, function () {
              that.getAgencyList();
            }, function (errorMessage) {
              that.$alert(errorMessage.errorMessage, "删除失败");
            });
          });
      },
      customerInfoDetails:function(customerInfoId){
        this.$router.push({
          path:"/agency/details",
          query:{
            id:customerInfoId
          }
        });
      },
      editOrg:function(customerInfoId){
        this.$router.push({
          path:"/agency/form",
          query:{
            id:customerInfoId
          }
        });
      },
      addCustom:function(){
        this.$router.push("/agency/form");
      },
      getAgencyList:function(){
        var that=this;
        that.tableData=[];
        this.$rsClient.get("/customerInfo/list?page="+this.page, function(result){
            if(result.models){
              that.tableData=result.models;
            }
            if(result.pagingInfo){
              that.pagingInfo=result.pagingInfo;
            }
        });
      },
      gotoPage:function(page){
        this.page=page;
        this.getAgencyList();
      }
    },
    components: {
      Paging
    }
  }
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less" scoped>

</style>
